<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>地理编码</title>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript" src="http://local.manage.com/libs/jquery/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.6&key=861d37b933726a63d06c3736b7d1f601"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>


</head>
<body >
<select id="sssssdf" style="position: relative;top: 40px;left: 100px;z-index: 9999">
    <option value="重庆江北区">重庆江北区</option>
    <option value="重庆沙坪坝区">重庆沙坪坝区</option>
    <option value="重庆合川区">重庆合川区</option>
    <option value="重庆北碚区">重庆北碚区</option>
    <option value="重庆渝中区">重庆渝中区</option>
    <option value="重庆綦江区">重庆綦江区</option>
</select>
<div id="container"></div>



<div id="tip">
    
    <span id="result"></span>
</div>
<script type="text/javascript">
    var map = new AMap.Map("container", {
        resizeEnable: true
    });

  var marker = new AMap.Marker({
            map: map,
            //position: [ d.location.getLng(),  d.location.getLat()]
    });
    $('#sssssdf').change(function () {
        var name = $(this).val();
            geocoder(name) 
     });  

    function geocoder(name) {
       
        console.log(name)
        AMap.plugin('AMap.Geocoder', function() {
            var geocoder = new AMap.Geocoder({
                city: "全国", //城市，默认：“全国”
                radius: 1000, //范围，默认：500
                batch:false
            });
            //地理编码,返回地理编码结果
            geocoder.getLocation(name, function(status, result) {
                console.log(status);
                if (status === 'complete' && result.info === 'OK') {
                    geocoder_CallBack(result);
                }
            });
         });    
    }
    function addMarker(i, d) {
       marker.setPosition(d.location);

        var infoWindow = new AMap.InfoWindow({
            content: d.formattedAddress,
            offset: {x: 0, y: -30}
        });
        marker.on("mouseover", function(e) {
            infoWindow.open(map, marker.getPosition());
        });
    }
    //地理编码返回结果展示
    function geocoder_CallBack(data) {
        var resultStr = "";
        //地理编码结果数组
        var geocode = data.geocodes;
        for (var i = 0; i < geocode.length; i++) {
            //拼接输出html
            resultStr += "<span style=\"font-size: 12px;padding:0px 0 4px 2px; border-bottom:1px solid #C1FFC1;\">" + "<b>地址</b>：" + geocode[i].formattedAddress + "" + "&nbsp;&nbsp;<b>的地理编码结果是:</b><b>&nbsp;&nbsp;&nbsp;&nbsp;坐标</b>：" + geocode[i].location.getLng() + ", " + geocode[i].location.getLat() + "" + "<b>&nbsp;&nbsp;&nbsp;&nbsp;匹配级别</b>：" + geocode[i].level + "</span>";
            addMarker(i, geocode[i]);
        }
        map.setFitView();
        document.getElementById("result").innerHTML = resultStr;
    }
</script>
</body>
</html>